<template>
  <div class="elm-edit one_road">
    <elm-page-bb class="ei_edit" v-loading="loading">

    <el-form ref="model" :model="model" size="small" label-width="100px">
      <elm-row>
        <el-form-item label="名称" prop="title" :rules="[{ required: true, message: '名称 必须填写'}]">
          <el-input v-model="model.title"></el-input>
        </el-form-item>
      </elm-row>
      <elm-row v-show="false">
        <el-form-item label="别名" prop="node_alias">
          <el-input v-model="model.node_alias"></el-input>
        </el-form-item>
      </elm-row>
      <elm-row v-show="false">
        <el-col style='' :span='12'>
          <el-form-item label='节点策略：'>
            <el-select v-model="model.node_policy" size="mini" style="width:120px;">
              <el-option
                  v-for="item in nodePolicyList"
                  :key="item.value"
                  :label="item.name"
                  :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col style='' :span='12'>
          <el-form-item label='参与者选择：'>
            <el-select v-model="model.user_policy" size="mini" style="width:120px;">
              <el-option
                  v-for="item in nodeUserPolicyList"
                  :key="item.value"
                  :label="item.name"
                  :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </elm-row>
      <el-row v-show="model.user_policy=='手选参与者'" style="text-align: right;padding: 7px;">
        上一节点提交时手选本节点的参与者，若本节点为初始节点则以发起流程的用户为参与者。
      </el-row>
      <elm-row v-show="false" style="margin-top: 7px;border-top: 1px #E4E7ED solid;">
        <el-form-item label="退回策略">
          <span style="margin-left: 10px;">{{model.pb_policy}}</span>
        </el-form-item>
      </elm-row>
      <elm-row v-show="false">
        <el-form-item label="备注" prop="remark">
          <el-input type="textarea" :rows="2" v-model="model.remark"></el-input>
        </el-form-item>
      </elm-row>
    </el-form>

    <el-card v-show="model.user_policy=='全部参与者'" style="margin-right: 0;margin-left: 0;" shadow="hover">
      <div slot="header">
        <span style="font-weight: bold;">选择参与者</span>
        <span style="font-weight: lighter;float: right;">初始节点可不选</span>
      </div>
      <el-form size="small" label-width="120px">
        <elm-row>
          <el-form-item label='部门：'>
            <elm-tag :items="node_check_data.check_org_show" style="margin-left: -3px;" width="200px">
              <template  #text="{ item }">
                <span style="margin-right: 5px;">{{item.name}}</span>
              </template >
              <elm-org  @changed="orgSelected"  v-model="node_check_data.check_org_temp"></elm-org>
            </elm-tag>
          </el-form-item>
        </elm-row>
        <elm-row>
          <el-form-item label='角色：'>
            <elm-tag :items="node_check_data.check_role_show" style="margin-left: -3px;" width="200px">
              <template  #text="{ item }">
                <span style="margin-right: 5px;">{{item.name}}</span>
              </template >
              <el-select v-model="node_check_data.check_role_temp" size="mini" style="width:100%;" @change="roleSelected">
                <el-option
                    v-for="item in node_check_for_select.role_list"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id">
                </el-option>
              </el-select>
            </elm-tag>
          </el-form-item>
        </elm-row>
        <elm-row>
          <el-form-item label='用户：'>
            <elm-tag v-show="!node_check.check_user_n" :items="node_check_data.check_user_show" style="margin-left: -3px;" width="200px">
              <template  #text="{ item }">
                <span style="margin-right: 5px;">{{item.name}}</span>
              </template >
              <elm-user  @changed="userSelected"  v-model="node_check_data.check_user_temp"></elm-user>
              <!--<el-select v-model="node_check_data.check_user_temp" size="mini" style="width:120px;" @change="userSelected"
                         filterable remote :remote-method="findUserOptions">
                <el-option
                    v-for="item in node_check_for_select.user_list"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id">
                </el-option>
              </el-select>-->
            </elm-tag>
            <!--<el-switch v-model="node_check.check_user_n" active-color="#13ce66" inactive-color="#DCDFE6"
                       active-text="指定参与者（传参数：f_param_user_id）"></el-switch>-->
          </el-form-item>
        </elm-row>
        <elm-row>
          <el-form-item label='直接上级：'>
            <el-switch v-model="node_check.check_zjsj" @change="nodeCheckChanged"
                       active-color="#13ce66" inactive-color="#DCDFE6"
                       active-text="上一节点提交者的直接上级"></el-switch>
          </el-form-item>
        </elm-row>
        <elm-row>
          <el-form-item label='流程发起者：'>
            <el-switch v-model="node_check.check_flow_creater" @change="nodeCheckChanged"
                       active-color="#13ce66" inactive-color="#DCDFE6"
                       active-text="发起流程并提交完成初始节点的用户"></el-switch>
          </el-form-item>
        </elm-row>
        <elm-row>
          <el-form-item label='上一节点指定：'>
            <el-switch v-model="node_check.check_dynamic" @change="nodeCheckChanged_02"
                       active-color="#13ce66" inactive-color="#DCDFE6"
                       active-text="上一节点提交时指定的用户"></el-switch>
          </el-form-item>
        </elm-row>
      </el-form>
    </el-card>

    <el-card shadow="hover" style="height: 300px;">
      <div slot="header">
        <span style="font-weight: bold;">管理本节点的表单项</span>
      </div>
      <elm-table :data='ff_item_list' :stripe='true' :border='true' size='mini' :page-size="9999" style="max-height: 250px;">
        <el-table-column label="标题" min-width="100px" header-align="center">
          <template slot-scope="scope">
            {{scope.row.title}}
          </template>
        </el-table-column>
        <el-table-column label="在本节点" width="160px" fixed="right" align="center">
          <template slot-scope="scope">
            <el-switch v-model="scope.row.ee_show" active-color="#13ce66" inactive-color="#ff4949"
                       active-text="显示" inactive-text="不显示"></el-switch>
          </template>
        </el-table-column>
        <el-table-column label="在本节点" width="180px" fixed="right" align="center">
          <template slot-scope="scope">
            <el-switch v-show="scope.row.ee_show" active-color="#13ce66" inactive-color="#ff4949"
                       v-model="scope.row.ee_edit" active-text="填写" inactive-text="仅显示"></el-switch>
          </template>
        </el-table-column>
      </elm-table>
    </el-card>

    <template #bottom>
      <el-button type="success" size="small" @click="submit">立即保存</el-button>
      <el-button size="small" @click="close">取消</el-button>
    </template>
  </elm-page-bb>
  </div>
</template>

<script>
export default {
  extends: elmVueBase,
  data() {
    return {
      loading:true,

      DE_INFO: null,
      edit_type: '',

      flow_model:{},
      flowExist:false,

      model: {},

      default_pb_policy:'退首跳回',
      nodePolicyList:[{'name':'抢签','value':'抢签'},{'name':'会签','value':'会签'},],
      nodeUserPolicyList:[{'name':'全部参与者','value':'全部参与者'},{'name':'手选参与者','value':'手选参与者'},],

      node_check:{
        check_org:false,
        check_role:false,
        check_user:false,
        check_user_n:false,
        check_zjsj:false,
        check_flow_creater:false,
        check_dynamic:false,
      },
      node_check_for_select:{
        user_list:[],
        role_list:[],
        org_list:[],
      },
      node_check_data:{
        check_org:[],
        check_org_show:[],
        check_org_temp:null,

        check_role:[],
        check_role_show:[],
        check_role_temp:null,

        check_user:[],
        check_user_show:[],
        check_user_temp:null,
      },
      fInterfaceData:{
        'inter_org':{'id':'inter_0010','param_id':'01',},
        'inter_role':{'id':'inter_0020','param_id':'02',},
        'inter_user':{'id':'inter_0030','param_id':'03',},
        'inter_zjsj':{'id':'inter_0040','param_id':'04',},
        'inter_flow_creater':{'id':'inter_0050','param_id':'05',},
        'inter_dynamic':{'id':'inter_0060','param_id':'06',},
      },

      ff_item_list:[],
    }
  },
  mounted() {
    this.DE_INFO = elm.dialog.request;
    this.edit_type = this.DE_INFO.edit_type;
    this.flow_model = this.DE_INFO.flow_model;

    let ff_item_list = [];
    let DE_ff_item_list = this.DE_INFO.ffItemList;
    if(DE_ff_item_list!=null && DE_ff_item_list.length>0){
      for(let i=0;i<DE_ff_item_list.length;i++){
        let item = {
          'title':DE_ff_item_list[i].title,
          'column_name':DE_ff_item_list[i].column_name,
          'ee_show':true,
          'ee_edit':true,
        };
        ff_item_list.push(item);
      }
    }
    if(!this.em(this.DE_INFO.model.ee_ff_item)){
      let ee_ff_item = JSON.parse(this.DE_INFO.model.ee_ff_item);
      for(let i=0;i<ee_ff_item.length;i++){
        for(let kk=0;kk<ff_item_list.length;kk++){
          let item = ff_item_list[kk];
          if(item.column_name == ee_ff_item[i].column_name){
            item.ee_show = ee_ff_item[i].ee_show;
            item.ee_edit = ee_ff_item[i].ee_edit;
          }
        }
      }
    }
    this.ff_item_list = ff_item_list;
    console.log(JSON.stringify(this.ff_item_list));

    this.v_getData();
  },
  methods: {
    async v_getData(){
      this.loading = true;

      if(this.edit_type=='create'){
        this.model = {
          'id': elm.newGuid(),
          'flow_id': this.flow_model.id,
          'node_policy': this.nodePolicyList[0].value,
          'user_policy': this.nodeUserPolicyList[0].value,
          'pb_policy': this.default_pb_policy,
        };
      }
      else{
        this.flowExist = true;
        this.model = this.DE_INFO.model;
      }

      //如果流程尚未入库，那么先保存流程
      let check = await elm.post('/system/flow/one_road_flow/GetFlowList', { "id": this.flow_model.id});
      if (check.length>0) {
        this.flowExist = true;
        //this.DE_INFO.callVue.setFLowExist(true);
      }
      else{
        if (this.em(this.flow_model.title)){this.$message.error('缺少流程名称'); this.v_cancle();return;}
        if (this.em(this.flow_model.code)){
          let cData = await elm.post('/system/flow/one_road_flow/GetFlowCodeForCreate', {});
          if(this.em(cData.code) || cData.code.indexOf('flow_')<0){
            this.$message.error('流程编码生成失败，请稍后尝试。');
            this.loading = false;
            return;
          }
          this.flow_model.code = cData.code;
        }
        if(this.em(this.flow_model.order_number)){this.flow_model.order_number = this.flow_model.code;}
        let check = await elm.post('/system/flow/one_road_flow/GetFlowList', { "code": this.flow_model.code});
        if (check.length>0 && check[0].id !=this.flow_model.id) { this.$message.error('流程编码重复'); this.v_cancle();return;}

        if(!this.em(this.flow_model.secForm_tableName)){
          this.flow_model['ff_tablename'] = 'biz_'+this.flow_model.secForm_tableName;
        }
        else{ this.flow_model['ff_tablename'] = 'biz_'+this.flow_model.code; }

        let saveFlag = await elm.post('/system/flow/one_road_flow/UpserFlowAndSecForm', {'model':this.flow_model});
        if (saveFlag==false){this.$message.error('流程保存失败'); this.v_cancle();return;}

        this.DE_INFO.callVue.setFLowExist(true);
      }

      this.getExtraData();
    },
    async getExtraData(){
      this.loading = true;

      this.node_check.check_org = false;
      this.node_check.check_role = false;
      this.node_check.check_user = false;
      this.node_check.check_zjsj = false;
      this.node_check.check_flow_creater = false;
      this.node_check.check_dynamic = false;
      this.node_check_data.check_org = [];
      this.node_check_data.check_org_show = [];
      this.node_check_data.check_role = [];
      this.node_check_data.check_role_show = [];
      this.node_check_data.check_user = [];
      this.node_check_data.check_user_show = [];

      let checkForSelectData = await elm.post('/system/flow/one_road_flow/GetDataForNodeCheckEdit', { });
      this.node_check_for_select.role_list = checkForSelectData.role_list;
      this.node_check_for_select.org_list = checkForSelectData.org_list;
      this.node_check_for_select.user_list = [];
      //this.node_check_for_select.user_list = checkForSelectData.user_list;
      let nodeCheckData = await elm.post('/system/flow/one_road_flow/GetNodeCheckData', {'id':this.model.id });
      if(nodeCheckData.check_list.length>0){
        for(let i=0;i<nodeCheckData.check_list.length;i++){
          let nChceck = nodeCheckData.check_list[i];
          if(nChceck.iface_id==this.fInterfaceData.inter_org.id){
            this.node_check.check_org = true;
            let paramValues = [];
            for(let kk=0;kk<nodeCheckData.check_param_list.length;kk++){
              let nChceckParam = nodeCheckData.check_param_list[kk];
              if(nChceckParam.check_id == nChceck.id && nChceckParam.iface_param_id == this.fInterfaceData.inter_org.param_id){
                paramValues.push(nChceckParam.value);
              }
            }
            this.node_check_data.check_org = paramValues;
            for(let jj=0;jj<this.node_check_data.check_org.length;jj++){
              for(let kk=0;kk<this.node_check_for_select.org_list.length;kk++){
                if(this.node_check_data.check_org[jj]==this.node_check_for_select.org_list[kk].id){
                  this.node_check_data.check_org_show.push({'id':this.node_check_for_select.org_list[kk].id,'name':this.node_check_for_select.org_list[kk].org_name_path});
                }
              }
            }
          }
          else if(nChceck.iface_id==this.fInterfaceData.inter_role.id){
            this.node_check.check_role = true;
            let paramValues = [];
            for(let kk=0;kk<nodeCheckData.check_param_list.length;kk++){
              let nChceckParam = nodeCheckData.check_param_list[kk];
              if(nChceckParam.check_id == nChceck.id && nChceckParam.iface_param_id == this.fInterfaceData.inter_role.param_id){
                paramValues.push(nChceckParam.value);
              }
            }
            this.node_check_data.check_role = paramValues;
            for(let jj=0;jj<this.node_check_data.check_role.length;jj++){
              for(let kk=0;kk<this.node_check_for_select.role_list.length;kk++){
                if(this.node_check_data.check_role[jj]==this.node_check_for_select.role_list[kk].id){
                  this.node_check_data.check_role_show.push({'id':this.node_check_for_select.role_list[kk].id,'name':this.node_check_for_select.role_list[kk].name});
                }
              }
            }
          }
          else if(nChceck.iface_id==this.fInterfaceData.inter_user.id){
            if(false && nodeCheckData.check_param_list.length>0 && nodeCheckData.check_param_list[0].value=='nothing'){
              this.node_check.check_user_n = true;
            }
            else{
              this.node_check.check_user_n = false;
              if(nodeCheckData.check_param_list.length>0){
                this.node_check.check_user = true;
                let paramValues = [];
                for(let kk=0;kk<nodeCheckData.check_param_list.length;kk++){
                  let nChceckParam = nodeCheckData.check_param_list[kk];
                  if(nChceckParam.check_id == nChceck.id && nChceckParam.iface_param_id == this.fInterfaceData.inter_user.param_id){
                    paramValues.push(nChceckParam.value);
                    this.node_check_data.check_user_show.push({'id':nChceckParam.value,'name':nChceckParam.uu_user_name});
                  }
                }
                this.node_check_data.check_user = paramValues;
              }
            }
          }
          else if(nChceck.iface_id==this.fInterfaceData.inter_zjsj.id){
            this.node_check.check_zjsj = true;
          }
          else if(nChceck.iface_id==this.fInterfaceData.inter_flow_creater.id){
            this.node_check.check_flow_creater = true;
          }
          else if(nChceck.iface_id==this.fInterfaceData.inter_dynamic.id){
            this.node_check.check_dynamic = true;
          }
        }
      }
      this.loading = false
    },

    async submit() {
      try{await this.$refs["model"].validate();}catch{console.log('表单验证未通过'); return;}

      this.loading = true;

      //组装参与者数据
      let node_check = [];
      let node_check_param = [];
      if(this.model.user_policy=='全部参与者'){
        this.node_check_data.check_org = [];
        for(let i=0;i<this.node_check_data.check_org_show.length;i++){
          this.node_check_data.check_org.push(this.node_check_data.check_org_show[i].id);
        }
        this.node_check_data.check_role = [];
        for(let i=0;i<this.node_check_data.check_role_show.length;i++){
          this.node_check_data.check_role.push(this.node_check_data.check_role_show[i].id);
        }
        this.node_check_data.check_user = [];
        for(let i=0;i<this.node_check_data.check_user_show.length;i++){
          this.node_check_data.check_user.push(this.node_check_data.check_user_show[i].id);
        }

        this.node_check.check_org = this.node_check_data.check_org.length>0;
        this.node_check.check_role = this.node_check_data.check_role.length>0;
        this.node_check.check_user = this.node_check_data.check_user.length>0;
        if(this.node_check.check_user_n){this.node_check.check_user =false;}

        if(this.node_check.check_org){
          let cc = {
            'id': elm.newGuid(),
            'iface_id': this.fInterfaceData.inter_org.id,
          };
          for(let i=0;i<this.node_check_data.check_org.length;i++){
            let ccItem = {
              'id': elm.newGuid(),
              'check_id': cc.id,
              'iface_param_id': this.fInterfaceData.inter_org.param_id,
              'value': this.node_check_data.check_org[i],
            };
            node_check_param.push(ccItem);
          }
          node_check.push(cc);
        }
        if(this.node_check.check_role){
          let cc = {
            'id': elm.newGuid(),
            'iface_id': this.fInterfaceData.inter_role.id,
          };
          for(let i=0;i<this.node_check_data.check_role.length;i++){
            let ccItem = {
              'id': elm.newGuid(),
              'check_id': cc.id,
              'iface_param_id': this.fInterfaceData.inter_role.param_id,
              'value': this.node_check_data.check_role[i],
            };
            node_check_param.push(ccItem);
          }
          node_check.push(cc);
        }
        if(this.node_check.check_user){
          let cc = {
            'id': elm.newGuid(),
            'iface_id': this.fInterfaceData.inter_user.id,
          };
          for(let i=0;i<this.node_check_data.check_user.length;i++){
            let ccItem = {
              'id': elm.newGuid(),
              'check_id': cc.id,
              'iface_param_id': this.fInterfaceData.inter_user.param_id,
              'value': this.node_check_data.check_user[i],
            };
            node_check_param.push(ccItem);
          }
          node_check.push(cc);
        }
        if(this.node_check.check_user_n){
          let cc = {
            'id': elm.newGuid(),
            'iface_id': this.fInterfaceData.inter_user.id,
          };
          let ccItem = {
            'id': elm.newGuid(),
            'check_id': cc.id,
            'iface_param_id': this.fInterfaceData.inter_user.param_id,
            'value': 'nothing',
          };
          node_check_param.push(ccItem);
          node_check.push(cc);
        }
        if(this.node_check.check_zjsj){
          let cc = {
            'id': elm.newGuid(),
            'iface_id': this.fInterfaceData.inter_zjsj.id,
          };
          let ccItem = {
            'id': elm.newGuid(),
            'check_id': cc.id,
            'iface_param_id': this.fInterfaceData.inter_zjsj.param_id,
            //'value': 'nothing',
          };
          node_check_param.push(ccItem);
          node_check.push(cc);
        }
        if(this.node_check.check_flow_creater){
          let cc = {
            'id': elm.newGuid(),
            'iface_id': this.fInterfaceData.inter_flow_creater.id,
          };
          let ccItem = {
            'id': elm.newGuid(),
            'check_id': cc.id,
            'iface_param_id': this.fInterfaceData.inter_flow_creater.param_id,
            //'value': 'nothing',
          };
          node_check_param.push(ccItem);
          node_check.push(cc);
        }
        if(this.node_check.check_dynamic){
          let cc = {
            'id': elm.newGuid(),
            'iface_id': this.fInterfaceData.inter_dynamic.id,
          };
          let ccItem = {
            'id': elm.newGuid(),
            'check_id': cc.id,
            'iface_param_id': this.fInterfaceData.inter_dynamic.param_id,
            //'value': 'nothing',
          };
          node_check_param.push(ccItem);
          node_check.push(cc);
        }
      }

      //组装表单项配置数据
      let ff_item_list = [];
      for(let i=0;i<this.ff_item_list.length;i++){
        let item = {
          'column_name':this.ff_item_list[i].column_name,
          'ee_show':this.ff_item_list[i].ee_show,
          'ee_edit':this.ff_item_list[i].ee_show && this.ff_item_list[i].ee_edit,
        };
        ff_item_list.push(item);
      }

      this.model['flow_id'] = this.flow_model.id;
      let pData = {
        'node':this.model,
        'node_check':node_check,
        'node_check_param':node_check_param,
      };
      pData.node['ee_ff_item'] = JSON.stringify(ff_item_list);
      let result = await elm.post('/system/flow/one_road_flow/UpsertOneNode_OneRoadFLow', pData);
      if( result==false ){ this.$message.error('节点保存失败'); }
      else { this.$message.success('节点已保存'); }

      this.DE_INFO.callVue.v_getNodeList();
      this.v_cancle();
    },
    v_cancle:function (){
      this.close();//extends: elmVueBase
    },

    orgSelected(){
      for(let i=0;i<this.node_check_for_select.org_list.length;i++){
        let item = this.node_check_for_select.org_list[i];
        if(item.id == this.node_check_data.check_org_temp){
          for(let kk=0;kk<this.node_check_data.check_org_show.length;kk++){
            if(this.node_check_data.check_org_show[kk].id == item.id){
              this.$message.error('已添加的部门'); return;
            }
          }

          this.node_check_data.check_org_show.push({'id':item.id,'name':item.org_name_path});
          this.node_check_data.check_org_temp = null;
        }
      }

      this.node_check.check_dynamic=false;

      this.nodeCheckChanged();
    },
    roleSelected(){
      for(let i=0;i<this.node_check_for_select.role_list.length;i++){
        let item = this.node_check_for_select.role_list[i];
        if(item.id == this.node_check_data.check_role_temp){
          for(let kk=0;kk<this.node_check_data.check_role_show.length;kk++){
            if(this.node_check_data.check_role_show[kk].id == item.id){
              this.$message.error('已添加的角色'); return;
            }
          }

          this.node_check_data.check_role_show.push({'id':item.id,'name':item.name});
          this.node_check_data.check_role_temp = null;
        }
      }

      this.node_check.check_dynamic=false;

      this.nodeCheckChanged();
    },
    userSelected(id,name){
      for(let kk=0;kk<this.node_check_data.check_user_show.length;kk++){
        if(this.node_check_data.check_user_show[kk].id == id){
          this.$message.error('已添加的用户'); return;
        }
      }

      this.node_check_data.check_user_show.push({'id':id,'name':name});
      this.node_check_data.check_user_temp = null;
      this.node_check_for_select.user_list = [];

      this.nodeCheckChanged();
    },
    nodeCheckChanged: function (s) {
      if(
          this.node_check_data.check_org_show.length>0
          || this.node_check_data.check_role_show.length>0
          || this.node_check_data.check_user_show.length>0
          || this.node_check.check_zjsj
          || this.node_check.check_flow_creater)
      {
        this.node_check.check_dynamic = false;
      }
    },
    nodeCheckChanged_02: function (s) {
      if(this.node_check.check_dynamic){
        this.node_check_data.check_org_show = [];
        this.node_check_data.check_role_show = [];
        this.node_check_data.check_user_show = [];
        this.node_check.check_zjsj = false;
        this.node_check.check_flow_creater = false;
      }
    },

    em: function (s) {
      if (s == null || s == '') { return true; }
      else { return false; }
    },

    userSelected_Old(){
      for(let i=0;i<this.node_check_for_select.user_list.length;i++){
        let item = this.node_check_for_select.user_list[i];
        if(item.id == this.node_check_data.check_user_temp){
          for(let kk=0;kk<this.node_check_data.check_user_show.length;kk++){
            if(this.node_check_data.check_user_show[kk].id == item.id){
              this.$message.error('已添加的用户'); return;
            }
          }

          this.node_check_data.check_user_show.push({'id':item.id,'name':item.name});
          this.node_check_data.check_user_temp = null;
          this.node_check_for_select.user_list = [];
        }
      }
    },
    async findUserOptions(name){
      if(this.em(name)){
        this.node_check_for_select.user_list = [];
        return;
      }
      this.node_check_for_select.user_list = await elm.post('/system/login/GetUserList', {'name':name });
    },

  }
}
</script>
<style>
.one_road .elm-body{padding: 5px;}
</style>